<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title>iTrip-旅游首页</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" href="css/travel.css">
		<link rel="stylesheet" href="css/footer.css">
		<link rel="stylesheet" href="css/swiper.min.css">
		<script src="js/src/flexible.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<section id="layout">
			<!-- 顶部搜索栏 -->
			<header class="search">
				<a href="index.html" class="back">返回</a>
				<div class="search-box">
					<span for="">北京</span>
					<form action="#" method="">
						<input type="text" src="" placeholder="目的地/关键词" />
					</form>
				</div>
			</header>
			<section class="main">
				<!-- 轮播图 -->
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<div class="swiper-slide"><a href="#"><img src="images/img/travel-banner02.jpg" alt="" /></a></div>
						<div class="swiper-slide"><a href="#"><img src="images/img/travel-banner01.jpg" alt="" /></a></div>
						<div class="swiper-slide"><a href="#"><img src="images/img/travel-banner03.jpg" alt="" /></a></div>
						<div class="swiper-slide"><a href="#"><img src="images/img/travel-banner04.jpg" alt="" /></a></div>
					</div>
					<div class="swiper-pagination"></div>
				</div>
				<!-- 导航区 -->
				<nav class="navlist">
					<ul>
						<li><a href="travelList.html"><img src="images/icon/nav0.png" alt="" />出境游</a></li>
						<li><a href="travelList.html"><img src="images/icon/nav1.png" alt="" />国内游</a></li>
						<li><a href="travelList.html"><img src="images/icon/nav2.png" alt="" />周边游</a></li>
						<li><a href="travelList.html"><img src="images/icon/nav3.png" alt="" />当地游</a></li>
					</ul>
				</nav>
				<!-- 力荐区 -->
				<div class="scenic">
					<ul>
						<li class="w60">
							<a href="">
								<img src="images/img/travel-show_01.jpg" alt="">
							</a>
						</li>
						<li class="w40">
							<a href="">
								<img src="images/img/travel-show_02.jpg" alt="">
							</a>
						</li>
						<li class="w40">
							<a href="">
								<img src="images/img/travel-show_03.jpg" alt="">
							</a>
						</li>
						<li class="w60">
							<a href="">
								<img src="images/img/travel-show_04.jpg" alt="">
							</a>
						</li>
					</ul>
				</div>
				<!-- 出境游 -->
				<div class="exit">
					<div class="title">
						出境游<img src="images/img/travel-look0401_01.png" alt="" >
					</div>
					<ul class="content">
						
						<li>
							<img src="images/img/travel-look0401_02.jpg" alt="">
							<div class="desc">
							<p>曼谷+芭提雅6日5晚自由 行（4钻）</p>
								<div class="tag">
									<span>席位充足</span>
									<span class="prize">
										<i>¥</i><span>1999</span>&nbsp;起
									</span>
								</div>
							</div>
							
						</li>
						<li>
							<img src="images/img/travel-look0401_03.jpg" alt="">
							<div class="desc">
								<p>美国东西海岸+夏威夷+波士顿+纽约+华盛顿</p>
								<div class="tag">
									<span>席位充足</span>
									<span class="prize">
										<i>¥</i><span>1999</span>&nbsp;起
									</span>
								</div>
							</div>
							
						</li>
						<li>
							<img src="images/img/travel-look0401_04.jpg" alt="">
							<div class="desc">
								<p>日本东京+大阪7日6晚自 由行【美食·购物】</p>
								<div class="tag">
									<span>席位充足</span>
									<span class="prize">
										<i>¥</i><span>1999</span>&nbsp;起
									</span>
								</div>
							</div>
							
						</li>
						<li>
							<img src="images/img/travel-look0401_06.jpg" alt="">
							<div class="desc">
								<p>意大利+梵蒂冈+瑞士+法 国+维罗纳13日跟团游...</p>
								<div class="tag">
									<span>席位充足</span>
									<span class="prize">
										<i>¥</i><span>1999</span>&nbsp;起
									</span>
								</div>
							</div>
							
						</li>
						
						
						
					
					</ul>
				</div>
			</section>
			<footer class="tabbar">
				<div class="nav">
					<a href="travel.html" class="active"><span class="travel"></span><br>旅游首页</a>
					<a href="destination.html"><span class="destination"></span><br>目的地</a>
					<a href="history.html"><span class="history"></span><br>浏览历史</a>
					<a href="myinfo.html"><span class="user"></span><br>个人</a>
				</div>
			</footer>
			<a href="javasript:;" id="top">顶部</a>
		</section>
		
		<script src="js/src/bscroll.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/src/swiper.min.js"></script>
		<script>
			 // 轮播图
			 var mySwiper = new Swiper(".swiper-container",{
			     loop:true,
			     autoplay:{
			         delay:2000,
			         disableOnInteraction:false //用户操作swiper之后，是否禁止autoplay。默认为true：停止。
			
			     },
			     pagination:{
			         el:".swiper-pagination",
			        clickable:true,//此参数设置为true时，点击分页器的指示点分页器会控制Swiper切换。
			     },
			})
			
		</script>
	</body>
</html>
